<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
<%@ page contentType="text/html; charset=utf-8"%>
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<meta name="renderer" content="webkit|ie-comp|ie-stand">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport"
	content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
<meta http-equiv="Cache-Control" content="no-siteapp" />
<link rel="Bookmark" href="favicon.ico">
<link rel="Shortcut Icon" href="favicon.ico" />
<link rel="stylesheet" href="/layuiadmin/layui/css/layui.css"
	media="all">
<link rel="stylesheet" href="/layuiadmin/style/admin.css" media="all">
<title>商家管理系统</title>
<meta name="keywords" content="" />
<meta name="description" content="" />
<style>
.colorhuang, .qiagcolor:hover {
	color: #f79d3c;
}

.editThis, .updateThis, .updatePassword {
	border: 1px solid #fff;
}

.operation button {
	margin: 3px;
}

.xingdx {
	background-color: #f9f9f9;
}

tr td {
	text-align: center !important;
}
	tr th{text-align: center!important;font-weight: bold !important;}
</style>
</head>
<body>
	<div class="layui-fluid">
		<div class="layui-row layui-col-space15">
			<div class="layui-col-md12">
				<div class="layui-card">
					<div class="layui-card-body layui-form">
						<%-- 查询条件设置 --%>
						<div class="layui-container layui-form-item" style="padding-bottom: 50px">
							<div class="layui-col-xs12">&nbsp;</div>
							<div class="layui-col-md12">
								<div class="layui-col-md3">
									<div class="layui-col-sm3" style="line-height: 38px">订单编号：</div>
									<div class="layui-col-sm7">
										<input type="text" name="orderCode" class="layui-input">
									</div>
								</div>
								<div class="layui-col-md3">
									<div class="layui-col-sm3" style="line-height: 38px">下单时间：</div>
									<div class="layui-col-sm8">
										<input class="layui-input" name="queryTime" id="laydate-cn"
											autocomplete="off">
									</div>
								</div>
								<div class="layui-col-md3">
									<div class="layui-col-sm9 layui-col-sm-offset3">
										<button class="layui-btn layuiadmin-btn-list" lay-submit
										lay-filter="LAY-app-contlist-search">查询</button>
									</div>
								</div>
							</div>
							<div class="layui-col-md12">
								<hr>
							</div>
						</div>
						<%-- 数据展示 --%>
						<table class="layui-table" id="table" lay-filter="table">
						</table>
						<script type="text/html" id="toolbar">
							<div class="layui-btn-container">
								{{#  if(d.status == 0){ }}
									<a class="layui-btn layui-btn-warm layui-btn-xs" lay-event="sendThis">发货</a>
								{{#  } }}
							</div>
						</script>
						<script type="text/html" id="status">
							{{#  if(d.status == 0){ }}
							<span class="layui-badge">未发</span>
							{{#  }else{ }}
							<span class="layui-badge layui-bg-green">已发</span>
							{{#  } }}
						</script>
						<script type="text/html" id="address">
							<span>{{(d.addrPrefix)}} {{d.addressDetail}}</span>
						</script>
					</div>
				</div>
			</div>
		</div>
	</div>

	<script src="/layuiadmin/layui/layui.js"></script>
	<script src="/js/common.js"></script>
	<script type="text/javascript" src="/js/jquery/jquery.min.js"></script>
	<script>
		layui.config({
			base : '/layuiadmin/' //静态资源所在路径
		}).extend({
			index : 'lib/index' //主入口模块
		}).use([ 'index', 'form', 'laydate', 'table' ],function() {
			var $ = layui.$, layer = layui.layer, admin = layui.admin, form = layui.form, 
				element = layui.element, laydate = layui.laydate, table = layui.table;
			form.render('select');
			element.render();
			laydate.render({
				elem : '#laydate-cn',
				range : '~'
			});

			table.render({
				elem : '.layui-table',
				url : '/order/queryOrderExp',
				page:true,
				request: {
					pageName: 'current', //页码的参数名称，默认：page
					limitName: 'size' //每页数据量的参数名，默认：limit
				},
				cols : [[ 
					{field : 'orderCode', title:'订单编号', minWidth:140},
					{field : 'createTime', title : '创建时间', minWidth:130,
						templet:"<div>{{layui.util.toDateString(d.createTime,'yyyy-MM-dd HH:mm:ss')}}</div>"},
					{field : 'receiver', title : '收货人', width:100},
					{field : 'phone', title : '联系电话', width:120},
					{field : 'address', title : '收货地址', width:240,templet:"#address"},
					{field : 'status', title : '发货', width:80,templet:"#status"},
					// {field : 'warehouseName', title:'仓库', width:110},
					{title : '操作', templet:'#toolbar',width:100}
				]],
				skin : "row",
				even: true,
				size:"lg"
			});
			
			
			var active = {
				sendThis : function(id,expDetailId,detailIds) {
					layer.open({
						title : '订单发货',
						type : 2,
						area : [ '580px', '550px' ],
						content : '/order/orderSend?orderId='+ id + '&id=' +expDetailId + "&detailIds=" + detailIds
					});
				}
			};
			
			//监听事件
			table.on('tool(table)', function(obj){
				var data = obj.data; //获得当前行数据
				var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
				var tr = obj.tr; //获得当前行 tr 的DOM对象
				if (layEvent === 'sendThis') {
					active[layEvent] && active[layEvent].call(this, data.orderId,data.id,data.detailIds);
				}
			});
			
			//监听搜索
		    form.on('submit(LAY-app-contlist-search)', function(data){
		      var field = data.field;
		      //执行重载
		      table.reload('table', {
		        where: field
		      });
		    });
			
		});
	</script>
</body>
</html>